<template>
    <div class="avanced_mod" :class="themeClass">
      <v-loading v-if="loading" />
      <v-nav title=""></v-nav>
      <div class="avanced_mod_box">
        <div class="moomoo_form">
          <div class="moomoo_form_input">
            <p>{{ $t('message.性别') }}</p>
            <van-field class="input" readonly name="picker" :disabled="isDisabled" :value="form.sex.text" :placeholder="$t('message.请选择性别')" @click="showPicker = !isDisabled ? true : false" />
            <van-popup v-model="showPicker" position="bottom">
              <van-picker show-toolbar :columns="cardTypeList" @confirm="onConfirm" @cancel="showPicker = false" :default-index="form.sex.value" :confirm-button-text="$t('info.info10')" :cancel-button-text="$t('info.info11')" />
            </van-popup>
          </div>
          <div class="moomoo_form_input">
            <p>{{ $t('message.年龄') }}</p>
            <van-field class="input" v-model="form.age" :disabled="isDisabled" :placeholder="$t('message.请填写年龄')" />
          </div>
          <div class="moomoo_form_input">
            <p>{{ $t('message.国家') }}</p>
            <van-field class="input" readonly name="picker" :disabled="isDisabled" :value="form.guojia.text" :placeholder="$t('message.请选择国家')" @click="showPicker2 = !isDisabled ? true : false" />
            <van-popup v-model="showPicker2" position="bottom">
              <van-picker show-toolbar :columns="langList" @confirm="onConfirm2" @cancel="showPicker2 = false" :default-index="form.guojia.value" :confirm-button-text="$t('info.info10')" :cancel-button-text="$t('info.info11')" />
            </van-popup>
            <!-- <van-field class="input" v-model="form.number" :disabled="isDisabled" :placeholder="$t('message.请选择国家')" /> -->
          </div>
          <!-- <div class="moomoo_form_input">
            <p>{{ $t('message.盘口') }}</p>
            <van-field class="input" v-model="form.pankou" :disabled="isDisabled" :placeholder="$t('message.请填写盘口')" />
          </div> -->
  
          <div class="moomoo_form_submit">
            <van-button color="#DAAB51" :disabled="isDisabled" @click="primarySubmit">{{ primarySubmitText }}</van-button>
          </div>
        </div>
      </div>
    </div>
  </template>
  
  <script>
  export default {
    name: 'message',
    data() {
      return {
        form: {
            age:'',
            sex:{},
            guojia:{},
             pankou:'',
               //   type: {},
        //   name: '',
        //   number: ''
        },
        cardTypeList: [
          { text: this.$t('message.男'), value: 0 },
          { text: this.$t('message.女'), value: 1 },
        ],
        langList: [
        // {
        //     text: '中',
        //   value: 'cn'
        // },
        // {
        //     text: '泰',
        //     value: 'tw'
        // },
        // {
        //     text: '日本',
        //     value: 'ja'
        // },
        // {
        //     text: 'English',
        //     value: 'en'
        // },
        // {
        //     text: 'عربي',
        //     value: 'ar'
        // },
        // {
        //     text: 'Русский',
        //     value: 'ru'
        // },
        // {
        //     text: 'Português',
        //     value: 'pt'
        // },
        // {
        //     text: 'español',
        //     value: 'es'
        // },
        // {
        //     text: '한국인',
        //     value: 'ko'
        // },
        // {
        //     text: 'Tiếng Việt',
        //     value: 'vi'
        // },
        // {
        //     text: 'แบบไทย',
        //     value: 'th'
        // },
        // {
        //     text: 'bahasa Indonesia',
        //     value: 'id'
        // }
      ],
        showPicker: false,
        loading: false,
        isDayTime: false,
        isDisabled: false,
        showPicker2:false,
        primarySubmitText: this.$t('PrimaryCertification.Submit certification')
      }
    },
    created() {
    //   this.getAuthentication()
    this.guojia()
    },
    computed: {
      themeClass() {
        return this.isDayTime ? '' : 'darknight'
      }
    },
    watch: {
      '$store.state.nightMode': {
        handler(newVal) {
          this.isDayTime = newVal
        },
        immediate: true
      }
    },
    methods: {
      async guojia(){
         let res=await this.$https.get('/index/lang_list')
         let lang=localStorage.getItem('lang')
         console.log(lang,'ddd')
         
           console.log(res,'区域信息')
              let n=[]
              res.data.forEach(e => {
                  e.value=e.id
                  if(lang=='en'){
                    e.text=e.code
                  }else if(lang=='ja'){
                    e.text=e.jp_name
                  }else if(lang=='ar'){
                    e.text=e.ai_name
                  }else if(lang=='tw'){
                    e.text=e.name
                  }else if(lang=='cn'){
                    e.text=e.zh_name
                  }else if(lang=='ru'){
                    e.text=e.ru_name
                  }else if(lang=='th'){
                    e.text=e.th_name
                  }else if(lang=='ko'){
                    e.text=e.ko_name
                  }else if(lang=='vi'){
                    e.text=e.tk_name
                  }else if(lang=='id'){
                    e.text=e.it_name
                  }else{  
                    e.text=e.code
                  }
                 
                  n.push(e)
              });
              
              this.langList=n
              console.log()
      },
      onConfirm(value) {
        this.form.sex = value
        this.showPicker = false
      },
      onConfirm2(value) {
        this.form.guojia = value
        this.showPicker2 = false
      },
      async primarySubmit() {
        
        if (JSON.stringify(this.form.sex) === '{}') {
          this.$toast(this.$t('message.请选择性别'))
          return
        }
        if (JSON.stringify(this.form.guojia) === '{}') {
          this.$toast(this.$t('message.请选择国家'))
          return
        }
        if (this.form.age.trim() === '') {
          this.$toast(this.$t('message.请填写年龄'))
          return
        }
        // if (this.form.pankou.trim() === '') {
        //   this.$toast(this.$t('message.请填写盘口'))
        //   return
        // }
        let params = {
          tab: 'primary',
          sex: this.form.sex.value,
          guojia: this.form.guojia.value,
          age: this.form.age,
          pankou: this.form.pankou
        }
        this.loading = true
        localStorage.setItem('message',JSON.stringify(params));
        this.$router.push({
          path: '/register',
        })
        // await this.$https.post('/user/submitAuthentication', params).then(res => {
        //   if (res != undefined && res.code == 1) {
        //     this.$router.go(-1)
        //   }
        // })
        this.loading = false
      },
      async getAuthentication() {
        this.loading = true
        await this.$https.get('/user/getAuthentication').then(res => {
          if (res != undefined && res.code == 1 && res.data) {
            this.form.type.text = this.cardTypeList[res.data.primary_type].text
            this.form.type.value = res.data.primary_type
            this.form.name = res.data.primary_name
            this.form.number = res.data.primary_number
            if (res.data.primary_review == 0) {
              this.primarySubmitText = this.$t('PrimaryCertification.Resubmit')
            } else if (res.data.primary_review == 1) {
              this.primarySubmitText = this.$t('PrimaryCertification.Authentication successful')
              this.isDisabled = true
            } else if (res.data.primary_review == 2) {
              this.primarySubmitText = this.$t('PrimaryCertification.Certification in progress')
              this.isDisabled = true
            }
          }
        })
        this.loading = false
      }
    }
  }
  </script>
  
  <style lang="less" scoped>
  @import url('./message.less');
  </style>
  